.my {
  position: fixed;
  top: 0;
  /* right: 100px; */
  right: 0;
  width: 35px;
  height: 100%;
  background-color: #333;
  font: 12px/1.5 arial, tahoma, \5b8b\4f53;
  z-index: 100000;
  color: rgb(196, 144, 59);
}

.activity {
  width: 100%;
  height: 150px;
  /* background-color: antiquewhite; */
}

.user {
  width: 100%;
  height: 32px;
  line-height: 32px;
  text-align: center;
  margin-top: 26px;
  cursor: pointer;
}

.user>i {
  font-size: 20px;
}

.user:hover {
  background-color: rgb(225, 170, 1);
  color: #fff;
}

.cart {
  width: 100%;
  height: 120px;
  /* line-height: 120px; */
  text-align: center;
  margin: 10px 0;
  color: #fff;
  border: 1px solid rgba(129, 128, 128, 0.207);
  border-left: none;
  border-right: none;
  cursor: pointer;
}

.cart>i {
  font-size: 20px;
}

.cart>span:first-of-type {
  display: inline-block;
  width: 20px;
  height: 50px;
  font-size: 13px;
  padding: 3px 0;
}

.cart>span:last-of-type {
  display: inline-block;
  width: 22px;
  height: 16px;
  line-height: 16px;
  font-size: 13px;
  background-color: red;
  border-radius: 5px;
  margin-top: 3px;
}

.cart:hover {
  background-color: rgb(225, 170, 1);
}

.my>ul {
  width: 100%;
  height: 360px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 99999;
}

.my>ul li {
  width: 100%;
  height: 26px;
  line-height: 26px;
  font-size: 14px;
  text-align: center;
  /* z-index: 99999; */

}

.my>ul li:first-child {
  margin-bottom: 30px;
}

.my>ul li:nth-child(5) {
  margin-bottom: 55px;
}

.my>ul li>a {
  width: 120px;
  height: 100%;
  color: rgb(196, 144, 59);
  font-size: 12px;
  position: relative;
  display: flex;
}

.my>ul li:hover .icon_a {
  color: #fff;
}

.my>ul li>a>i {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 35px;
  height: 100%;
  font-size: 18px;
  z-index: 999;
  background-color: #333;
  /* background-color: skyblue; */
}

.my>ul li>a>span {
  position: absolute;
  top: 0;
  left: 35px;
  height: 100%;
  background-color: #333;
  transition: left .5s;
  padding: 0 10px;
  /* background-color: pink; */
}

.my>ul li>a>img {
  position: absolute;
  bottom: 0;
  left: 35px;
  width: 159px;
  height: 249px;
  transition: left .5s;
  z-index: -2;
}

.my>ul li>a>div {
  position: absolute;
  left: 35px;
  bottom: 0;
  width: 160px;
  height: 236px;
  background: url('../images/my_app_wrap.png') no-repeat;
  transition: left .5s;
  z-index: -2;
}

.my>ul li>a>div>img {
  width: 134px;
  height: 134px;
  margin: 58px auto 0;
}

.my>ul li>a:hover span {
  left: -44px;
  background-color: rgb(225, 170, 1);
}

.my>ul li>a:hover img {
  left: -159px;
}

.my>ul li>a:hover div {
  left: -160px;
}

.my>ul li:hover,
.my>ul li:hover a,
.my>ul li>a:hover i {
  background-color: rgb(225, 170, 1);
}

.my>ul li:nth-child(n+6)>a:hover span {
  left: -68px;
}

.my>ul li:nth-child(8)>a:hover span {
  left: -55px;
}